<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script language="javascript" type="text/javascript" src="WdatePicker.js"></script>
<title>Insert title here</title>
</head>
<body>
	示例1-1-1 常规调用:<input id="d11" type="text" onClick="WdatePicker()"/>
	<br/>
	示例1-1-2 图标触发:<input id="d12" type="text"/>
	<img onclick="WdatePicker({el:$dp.$('d12')})" src="../skin/datePicker.gif" width="16" height="22" align="absmiddle">
	<br/>
	支持周显示-1:<input id="d121" type="text" onfocus="WdatePicker({isShowWeek:true})"/>
	<br>
	支持周显示-2:<input type="text" class="Wdate" id="d122" onFocus="WdatePicker({isShowWeek:true,onpicked:function() {$dp.$('d122_1').value=$dp.cal.getP('W','W');$dp.$('d122_2').value=$dp.cal.getP('W','WW');}})"/>
	<br>
	禁用清空功能:<input class="Wdate" type="text" id="d15" onFocus="WdatePicker({isShowClear:false,readOnly:true})"/>
	<br>
	自定义弹出位置:<input class="Wdate" type="text" id="d16" onfocus="WdatePicker({position:{left:100,top:50}})"/>
	<br>
	显示时分秒：<input type="text" id="d233" onFocus="WdatePicker({startDate:'%y-%M-01 00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:true})"/>
	<br>
	<!-- yMdHmswW分别代表年月日时分秒星期周,你可以任意组合这些元素来自定义你个性化的日期格式.

	日期格式表
	格式 	说明
	y 	将年份表示为最多两位数字。如果年份多于两位数，则结果中仅显示两位低位数。
	yy 	同上，如果小于两位数，前面补零。
	yyy 	将年份表示为三位数字。如果少于三位数，前面补零。
	yyyy 	将年份表示为四位数字。如果少于四位数，前面补零。
	M 	将月份表示为从 1 至 12 的数字
	MM 	同上，如果小于两位数，前面补零。
	d 	将月中日期表示为从 1 至 31 的数字。
	dd 	同上，如果小于两位数，前面补零。
	H 	将小时表示为从 0 至 23 的数字。
	HH 	同上，如果小于两位数，前面补零。
	m 	将分钟表示为从 0 至 59 的数字。
	mm 	同上，如果小于两位数，前面补零。
	s 	将秒表示为从 0 至 59 的数字。
	ss 	同上，如果小于两位数，前面补零。
	w 	返回星期对应的数字 0 (星期天) - 6 (星期六) 。
	D 	返回星期的缩写 一 至 六 (英文状态下 Sun to Sat) 。
	W 	返回周对应的数字 (1 - 53) 。
	WW 	同上，如果小于两位数，前面补零 (01 - 53) 。
	
	示例
	格式字符串 	值
	yyyy-MM-dd HH:mm:ss 	2008-03-12 19:20:00
	yy年M月 	08年3月
	yyyyMMdd 	20080312
	今天是:yyyy年M年d HH时mm分 	今天是:2008年3月12日 19时20分
	H:m:s 	19:20:0
	y年 	8年-->
	<br>
	例子：<input type="text" id="d241" onfocus="WdatePicker({dateFmt:'yyyy年MM月dd日 HH时mm分ss秒'})" class="Wdate" style="width:300px"/>
	<br>
	取得系统可识别的日期值(重要):<input id="d244" type="text" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy年M月d日',vel:'d244_2'})"/>
	<input id="d244_2" type="text" />
	<br>
	<!-- 
		格式  	说明
		%y 	当前年
		%M 	当前月
		%d 	当前日
		%ld 	本月最后一天
		%H 	当前时
		%m 	当前分
		%s 	当前秒
		#{} 	运算表达式,如:#{%d+1}:表示明天
		#F{} 	{}之间是函数可写自定义JS代码
	 -->
	只能选择今天以前的日期(包括今天):<input id="d421" class="Wdate" type="text" onfocus="WdatePicker({skin:'whyGreen',maxDate:'%y-%M-%d'})"/>
	<br>
	只能选择今天以后的日期(不包括今天):<input id="d422" class="Wdate" type="text" onfocus="WdatePicker({minDate:'%y-%M-#{%d+1}'})"/>
	<br>
	只能选择本月的日期1号至本月最后一天:<input id="d423" class="Wdate" type="text" onfocus="WdatePicker({minDate:'%y-%M-01',maxDate:'%y-%M-%ld'})"/>
	<br>
	<!-- 
	注意:
	两个日期的日期格式必须相同
	
	$dp.$ 相当于 document.getElementById 函数.
	那么为什么里面的 ' 使用 \' 呢? 那是因为 " 和 ' 都被外围的函数使用了,故使用转义符 \ ,否则会提示JS语法错误.
	所以您在其他地方使用时注意把 \' 改成 " 或者 ' 来使用.
	
	#F{$dp.$D(\'d4312\')||\'2020-10-01\'} 表示当 d4312 为空时, 采用 2020-10-01 的值作为最大值
	 -->
	前面的日期不能大于后面的日期且两个日期都不能大于2020-10-01:
	合同有效期从<input id="d4311" class="Wdate" type="text" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'d4312\')||\'2020-10-01\'}'})"/>到
	<input id="d4312" class="Wdate" type="text" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'d4311\')}',maxDate:'2020-10-01'})"/>
	<br>
	通过position属性,自定义弹出位置:<input id="d442" type="text" class="Wdate" onFocus="WdatePicker({disabledDays:[0,6]})"/>
	<br>
	禁用 每个月份的 5日 15日 25日:<input id="d451" type="text" class="Wdate" onFocus="WdatePicker({disabledDates:['5$']})"/>
	注意 :'5$' 表示以 5 结尾 注意 $ 的用法 
	
	<br>
	配合min/maxDate使用,可以把可选择的日期分隔成多段：<input id="d453" type="text" class="Wdate" onFocus="WdatePicker({minDate:'%y-%M-01',maxDate:'%y-%M-%ld',disabledDates:['0[4-7]$','1[1-5]$','2[58]$']})"/>
	<br>
	禁用前一个小时和后一个小时内所有时间 使用 %y %M %d %H %m %s 等变量:<input id="d2a25" type="text" class="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',disabledDates:['%y-%M-%d #{%H-1}\:..\:..','%y-%M-%d #{%H+1}\:..\:..']})"/>
	<br>
	使用onpicked实现日期选择联动:<input id="d5221" class="Wdate" type="text" onFocus="var d5222=$dp.$('d5222');WdatePicker({onpicked:function(){d5222.focus();},maxDate:'#F{$dp.$D(\'d5222\')}'})"/>
							至
							<input id="d5222" class="Wdate" type="text" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'d5221\')}'})"/> 
</body>
</html>